<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en" dir="ltr" lang="en-US"> <!--<![endif]-->
<head>
 <meta charset="UTF-8">
 <title>$SITE_NAME$</title>
 <link rel="stylesheet" href="/templates/css/bootstrap.css"> 
 <link rel="stylesheet" href="/templates/css//style.css" type="text/css" media="screen" />
 <link rel="stylesheet" href="/templates/css/tpl.css" type="text/css" />
 <!--[if lt IE 9]>
 <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
 <![endif]-->
 <!--[if lt IE 9]>
 <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
 <![endif]-->
 <script type="text/javascript">
 WebFontConfig = {
 google: { families: [ 'Play', 'Play', 'Arial'] }
 };
 (function() {
 var wf = document.createElement('script');
 wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
 '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
 wf.type = 'text/javascript';
 wf.async = 'true';
 var s = document.getElementsByTagName('script')[0];
 s.parentNode.insertBefore(wf, s);
 })();
 </script>
 <!-- Embed Google Web Fonts Via API -->
<link rel='stylesheet' id='fonts-css' href='/templates/css/fonts.css?ver=3.4.2' type='text/css' media='all' />
<link rel='stylesheet' id='prettyPhoto-css' href='/templates/css/prettyPhoto.css?ver=3.4.2' type='text/css' media='all' />
<link rel='stylesheet' id='flexslider-css' href='/templates/css/flexslider.css?ver=3.4.2' type='text/css' media='all' />
<link rel='stylesheet' id='bootstrap-responsive-css' href='/templates/css/bootstrap-responsive.css?ver=3.4.2' type='text/css' media='all' />
<link rel='stylesheet' id='responsive-css' href='/templates/css/responsive.css?ver=3.4.2' type='text/css' media='all' />
<link rel='stylesheet' id='bootstrap-css' href='/templates/assets/bootstrap/css/bootstrap.css?ver=3.3.3' type='text/css' media='screen' />
<link rel='stylesheet' id='js_composer_front-css' href='/templates/assets/css/js_composer_front.css?ver=3.3.3' type='text/css' media='screen' />
<link rel='stylesheet' id='layerslider_css-css' href='/templates/LayerSlider/css/layerslider.css?ver=2.0.0' type='text/css' media='all' />
 <!-- Custom Styling -->
<style type="text/css">
.main_container { 
 background-color: #f7f7f7;
 background-image: url(/templates/images/bg/bg12.png);
 background-attachment: fixed;
 background-repeat: repeat;
 background-position: top left; 
}
</style>

</head>
<script type='text/javascript' src='/templates/js/jquery.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/jquery.easing.1.3.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/jquery.isotope.min.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/superfish.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/supersubs.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/jquery.prettyPhoto.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/jquery.flexslider-min.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/jquery.fitvids.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/underscore.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/bootstrap.min.js?ver=3.4.2'></script>
<script type='text/javascript' src='http://temashdesign.com/progress/wp-includes/js/comment-reply.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/LayerSlider/js/layerslider.kreaturamedia.jquery-min.js?ver=2.0.0'></script>
<script type='text/javascript' src='/templates/js/jquery.carouFredSel.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/jquery.touchwipe.js?ver=3.4.2'></script>
<script type='text/javascript' src='/templates/js/jquery.scrollTo.js?ver=3.4.2'></script>
 <script type="text/javascript">
 
 jQuery(document).ready(function(){
 
 jQuery("#layerslider_1").layerSlider({ 
 autoStart : true,
 pauseOnHover : true,
 firstLayer : 1,
 animateFirstLayer : true,
 twoWaySlideshow : true,
 keybNav : true,
 touchNav : true,
 imgPreload : true,
 navPrevNext : true,
 navStartStop : true,
 navButtons : true,
 skin : 'noskin',
 skinsPath : 'http://temashdesign.com/progress/wp-content/themes/progress/includes/plugins/LayerSlider/skins/',
 globalBGColor : 'white',
 yourLogo : false,
 yourLogoStyle : 'position: absolute; left: 10px; top: 10px; z-index: 99;',
 yourLogoLink : false,
 yourLogoTarget : '_self',
 
 loops : 0,
 forceLoopNum : true,
 autoPlayVideos : false,
 
 
 autoPauseSlideshow : 'auto',
 youtubePreview : 'maxresdefault.jpg',
 
 cbInit : function() { },
 cbStart : function() { },
 cbStop : function() { },
 cbPause : function() { },
 cbAnimStart : function() { },
 cbAnimStop : function() { },
 cbPrev : function() { },
 cbNext : function() { } });
 });
 
 </script>
<body class="home page page-id-80 page-template page-template-template-home-php opera wpb-js-composer js-comp-ver-3.3.3">
$GLOBAL_TOP$
<div class="main_container"> 
<!-- main container --> 
 
 <div class="container" style="margin-bottom:20px;">
<!-- container -->
$GLOBAL_AHEADER$
<div class="container">
<!-- Homepage Slider Area--> 
<script type="text/javascript">
jQuery(window).load(function() {
//opens up our menu
//jQuery('#layerslider').ddUltraSharpSlider(5000);
jQuery('.ls-nav-prev, .ls-nav-next, .ls-nav-start, .ls-nav-stop').css({ opacity: 0, display: 'block' });
jQuery('#layerslider').hover(function() {
jQuery('.ls-nav-prev, .ls-nav-next').stop().animate({ opacity: 1 }, 200);
jQuery('.ls-nav-start, .ls-nav-stop').stop().animate({ opacity: 1 }, 200);
}, function() {
jQuery('.ls-nav-prev, .ls-nav-next').stop().animate({ opacity: 0 }, 200);
jQuery('.ls-nav-start, .ls-nav-stop').stop().animate({ opacity: 0 }, 200);
});
jQuery('.ls-nav-prev, .ls-nav-next').hover(function() {
jQuery(this).stop().animate({ opacity: 1 }, 100);
}, function() {
jQuery(this).stop().animate({ opacity: 1 }, 100);
});
});
</script>
<div id="layerslider">
<div id="layerslider_1" style="margin: 0px auto; width: 100%; height: 375px; ">
<div class="ls-layer" style="background-image: url(/templates/slider/background.jpg);slidedirection: top; slidedelay: 4000; durationin: 1500; durationout: 1500; easingin: easeInOutQuint; easingout: easeInOutQuint; delayin: 0; delayout: 2000;">
<img class="ls-s2" src="/templates/slider/desktop.png" alt="sublayer" style="position: absolute; top: 25px; left: 80%; slidedirection : right; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 300; delayout : 0;">
<img class="ls-s2" src="/templates/slider/macbook.png" alt="sublayer" style="position: absolute; top: 146px; left: 55%; slidedirection : right; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 500; delayout : 300;">
<img class="ls-s2" src="/templates/slider/ipad.png" alt="sublayer" style="position: absolute; top: 124px; left: 65%; slidedirection : left; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 700; delayout : 500;">
<img class="ls-s2" src="/templates/slider/iphone.png" alt="sublayer" style="position: absolute; top: 226px; left: 93%; slidedirection : right; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 900; delayout : 700;">
<img class="ls-s2" src="/templates/slider/leftbox.png" alt="sublayer" style="position: absolute; top: 0px; left: 20%; slidedirection : left; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 1000; delayout : 1700;">
<h1 class="ls-s2" style="position: absolute; top:35px; left: 60px; slidedirection : left; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutCubic; easingout : easeInOutQuint; delayin : 1200; delayout : 1200; padding:10px 20px; background-color:#1466ab; color:#FFF; font-weight:bold; text-transform:uppercase;"> Responsive </h1>
<h1 class="ls-s2" style="position: absolute; top:91px; left: 200px; slidedirection : top; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutCubic; easingout : easeInOutQuint; delayin : 1400; delayout : 1400; padding:10px 20px; background-color:#fff; color:#1466ab; font-weight:bold; text-transform:uppercase;"> Layout </h1>
<p class="ls-s2" style="position: absolute; top:176px; left: 60px; slidedirection : left; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutCubic; easingout : easeInOutQuint; delayin : 1600; delayout : 1600; font-family:Play, Helvetica, sans-serif; font-size:15px; line-height:20px; text-shadow:1px 1px #fff; color:#000; width:300px"> With a responsive design (Powered by Twitter Bootstrap) it is easily usable with any device (Desktop, tablet, mobile phone), without removing any content! </p><div class="ls-s2" style="position: absolute; top:285px; left: 60px; slidedirection : bottom; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutBounce; easingout : easeInOutQuint; delayin : 1800; delayout : 1800; "> <a href="/" class="btn btn-primary">Purchase Theme Now</a> </div></div>
<div class="ls-layer" style="background-image: url(/templates/slider/background2.jpg);slidedirection: bottom; slidedelay: 4000; durationin: 1500; durationout: 1500; easingin: easeInOutQuint; easingout: easeInOutQuint; delayin: 0; delayout: 2800;">
<img class="ls-s2" src="/templates/slider/shadow.png" alt="sublayer" style="position: absolute; top: 193px; left: 385px; slidedirection : bottom; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 350; delayout : 1500;">
<img class="ls-s2" src="/templates/slider/shot4.jpg" alt="sublayer" style="position: absolute; top: 179px; left: 370px; slidedirection : bottom; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 300; delayout : 1500;">
<img class="ls-s2" src="/templates/slider/shadow.png" alt="sublayer" style="position: absolute; top: 153px; left: 284px; slidedirection : bottom; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 550; delayout : 1700;">
<img class="ls-s2" src="/templates/slider/shot3.jpg" alt="sublayer" style="position: absolute; top: 136px; left: 270px; slidedirection : bottom; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 500; delayout : 1700;">
<img class="ls-s2" src="/templates/slider/shadow.png" alt="sublayer" style="position: absolute; top: 117px; left: 184px; slidedirection : bottom; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 750; delayout : 1900;">
<img class="ls-s2" src="/templates/slider/shot2.jpg" alt="sublayer" style="position: absolute; top: 102px; left: 170px; slidedirection : bottom; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 700; delayout : 1900;">
<img class="ls-s2" src="/templates/slider/shadow.png" alt="sublayer" style="position: absolute; top: 79px; left: 85px; slidedirection : bottom; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 950; delayout : 2100;">
<img class="ls-s2" src="/templates/slider/shot1.jpg" alt="sublayer" style="position: absolute; top: 61px; left: 70px; slidedirection : bottom; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 900; delayout : 2100;">
<img class="ls-s2" src="/templates/slider/colorpicker.png" alt="sublayer" style="position: absolute; top: 21px; left: 234px; slidedirection : top; slideoutdirection : top; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 1500; delayout : 2200;">
<img class="ls-s2" src="/templates/slider/rightbox.png" alt="sublayer" style="position: absolute; top: 0px; left: 77%; slidedirection : right; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 1300; delayout : 2700;">
<h1 class="ls-s2" style="position: absolute; top:35px; left: 78%; slidedirection : right; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 1400; delayout : 2300; padding:10px 20px; background-color:#1466ab; color:#FFF; font-weight:bold; text-transform:uppercase;"> Customizable </h1>
<h1 class="ls-s2" style="position: absolute; top:91px; left: 87%; slidedirection : top; slideoutdirection : top; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 1600; delayout : 2400; padding:10px 20px; background-color:#fff; color:#1466ab; font-weight:bold; text-transform:uppercase;"> Colors </h1>
<div class="ls-s2" style="position: absolute; top:176px; left: 100%; slidedirection : right; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 1800; delayout : 2500; "> <p style="font-family:Play, Helvetica, sans-serif; font-size:15px; line-height:20px; text-shadow:1px 1px #fff; color:#000; width:250px;text-align:right;position:absolute; right:60px;">Progress includes a backend color picker in the theme options that allows you to easily change the color throughout the entire theme.</p> </div>
<div class="ls-s2" style="position: absolute; top:285px; left: 100%; slidedirection : bottom; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutBounce; easingout : easeInOutQuint; delayin : 1900; delayout : 2600; "> <a href="/" class="btn btn-primary" style="position:absolute; right:60px; width:150px">Purchase Theme Now</a> </div></div>
<div class="ls-layer" style="background-image: url(/templates/slider/background3.jpg);slidedirection: top; slidedelay: 4000; durationin: 1500; durationout: 1500; easingin: easeInOutQuint; easingout: easeInOutQuint; delayin: 0; delayout: 1600;">
<div class="ls-s2" style="position: absolute; top:40px; left: 70%; slidedirection : right; slideoutdirection : right; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 300; delayout : 1200; "> <iframe src="http://player.vimeo.com/video/32852978?color=ff9933" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> </div>
<img class="ls-s2" src="/templates/slider/leftbox.png" alt="sublayer" style="position: absolute; top: 0px; left: 15%; slidedirection : left; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 500; delayout : 1600;"><h1 class="ls-s2" style="position: absolute; top:35px; left: 60px; slidedirection : left; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 700; delayout : 1300; padding:10px 20px; background-color:#1466ab; color:#FFF; font-weight:bold; text-transform:uppercase;"> Video </h1><h1 class="ls-s2" style="position: absolute; top:91px; left: 150px; slidedirection : top; slideoutdirection : top; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 900; delayout : 1400; padding:10px 20px; background-color:#fff; color:#1466ab; font-weight:bold; text-transform:uppercase;"> Support </h1><p class="ls-s2" style="position: absolute; top:176px; left: 60px; slidedirection : left; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutQuint; easingout : easeInOutQuint; delayin : 1100; delayout : 1500; font-family:Play, Helvetica, sans-serif; font-size:15px; line-height:20px; text-shadow:1px 1px #fff; color:#000; width:300px"> You can use images or any other HTML elements, including Flash, YouTube and Vimeo movies as layers. </p>
<div class="ls-s2" style="position: absolute; top:275px; left: 60px; slidedirection : bottom; slideoutdirection : left; parallaxin : .45; parallaxout : .45; durationin : 1500; durationout : 1500; easingin : easeInOutBounce; easingout : easeInOutQuint; delayin : 1200; delayout : 1600; "> <a href="/" class="btn btn-primary">Purchase Theme Now</a> </div></div></div>
<div class="ls-fallback-image"><a href="#"><img src="/templates/slider/fallback1.jpg" alt="Slider" /></a></div>
</div>
<!-- Homepage Content Area--> 
<!-- _________________________ Content Area _________________________ -->
<div class="row homecontent">
<div id="primary" class="span12">
<div class="row-fluid">
<div class="span4">
<div class="feature_box feature_style1">
<div class="feature_icon feature_beaker">
</div>
<h4>uCoz </h4>
<p>
 - -,       :          .        .
</p>
<div class="clearfix"></div>
</div>
</div> 
<div class="span4">
<div class="feature_box feature_style1">
<div class="feature_icon feature_cogs"></div>
<h4> uCoz</h4>
<p>
        . , ,       ,          ..
</p>
<div class="clearfix"></div>
</div>
</div>
<div class="span4">
<div class="feature_box feature_style1">
<div class="feature_icon feature_picture"></div>
<h4>  uCoz!</h4>
<p>
    :   (PHP, CGI  ..) , ,   (MySQL, MS SQL, Oracle  ..)       ""
</p>
<div class="clearfix"></div>
</div>
</div>
</div>
 
 </div>
 
 
 </div>
 
 <!-- Homepage Recent Portfolio Area--> 
 
<div class="clearfix"></div>
<div class="homepage_recent_projects"> 
<h3 class="homepage_recent_title">  </h3> 

<div id="home-portfolio-list" class="row">
<ul id="portfolio" class="portfolio-normal"> 
$MYINF_6$
</ul> 
</div>
 
<div class="portfolio-navigation">
<a href="#" id="home-portfolio-prev" class="portfolio-prev"></a>
<a href="#" id="home-portfolio-next" class="portfolio-next"></a>
<a href="/news" class="portfolio-list" title=" "></a>
</div>
 

 
 <script type="text/javascript">
 
 
 
 $("#portfolio").carouFredSel({
 circular: false,
 responsive: true,
 auto : false,
 height : "variable",


 items : {
 width : 300,
 visible: {
 min: 1,
 max: 4
 }
 },
 scroll : {
 duration: 900,
 easing : "easeInOutQuad",
 wipe : true,
 items: 1 },
 prev : { 
 button : "#home-portfolio-prev",
 key : "left"
 },
 next : { 
 button : "#home-portfolio-next",
 key : "right"
 },

 });
 
 </script>

</div>

 
 
 
 
 <!-- Homepage Recent Blog Posts Area-->
 
<div class="clearfix"></div>
<div class="homepage_recent_projects"> 
<h3 class="homepage_recent_title"> </h3> 

<div id="home-portfolio-list" class="row">
<ul id="blog-recent" class="portfolio-normal"> 
$MYINF_7$
</ul> 
</div>
<div class="blog-navigation">
<a href="#" id="home-blog-prev" class="portfolio-prev"></a>
<a href="#" id="home-blog-next" class="portfolio-next"></a>
<a href="/publ" class="blog-list" title=" "></a>
</div>
<script type="text/javascript"> 
 
 
 $("#blog-recent").carouFredSel({
 circular: false,
 responsive: true,
 auto : false,
 height : "variable",


 items : {
 width : 300,
 visible: {
 min: 1,
 max: 3
 }
 },
 scroll : {
 duration: 900,
 easing : "easeInOutQuad",
 wipe : true,
 items: 1 },
 prev : { 
 button : "#home-blog-prev",
 key : "left"
 },
 next : { 
 button : "#home-blog-next",
 key : "right"
 },

 });
 
 </script>

</div>

 <!-- Homepage Recent Portfolio Area--> 
 
<div class="clearfix"></div>
<div class="homepage_recent_projects"> 
<h3 class="homepage_recent_title">   </h3> 

<div id="home-portfolio-list" class="row">
<ul id="portfolio1" class="portfolio-normal"> 
$MYINF_8$
</ul> 
</div>
 
<div class="portfolio-navigation">
<a href="#" id="home-portfolio-prev1" class="portfolio-prev"></a>
<a href="#" id="home-portfolio-next1" class="portfolio-next"></a>
<a href="/photo" class="portfolio-list" title=" "></a>
</div>
 

 
 <script type="text/javascript">
 
 
 
 $("#portfolio1").carouFredSel({
 circular: false,
 responsive: true,
 auto : false,
 height : "variable",


 items : {
 width : 300,
 visible: {
 min: 1,
 max: 4
 }
 },
 scroll : {
 duration: 900,
 easing : "easeInOutQuad",
 wipe : true,
 items: 1 },
 prev : { 
 button : "#home-portfolio-prev1",
 key : "left"
 },
 next : { 
 button : "#home-portfolio-next1",
 key : "right"
 },

 });
 
 </script>

</div>

 

</div>
<br class="clearfix" />

</div> <!-- /main container -->
$GLOBAL_BFOOTER$
</body>
</html>